<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    
    <script src="fcfs.js"></script>

    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <meta http-equiv="X-UA-Compatible" content="ie=edge" />
  
    <script src="https://canvasjs.com/assets/script/canvasjs.min.js"></script>
    <script src="https://unpkg.com/swiper/swiper-bundle.min.js"></script>
  
  
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.1.3/dist/css/bootstrap.min.css" rel="stylesheet"
      integrity="sha384-1BmE4kWBq78iYhFldvKuhfTAU6auU8tT94WrHftjDbrCEXSU1oBoqyl2QvZ6jIW3" crossorigin="anonymous">
      <link rel="stylesheet" type="text/css" href="DiscScheduling.css">
    <title> Disc Scheduling </title>
</head>

<body>
    <h1>Disc Scheduling - FCFS</h1>
    <div class="block">
        <div id="ifManualInput" style="display:block">
            <label>Enter the request sequence:</label>
            <input id="Sequence" class="form-control" placeholder="Eg: 20, 35, 40" />
            <p></p>
            <label>Enter the initial head position:</label>
            <input id="Head" class="form-control" placeholder="Eg: 30" />
            <p></p>
            <div >
                <button class="button" onclick="FCFS()" id="FCFS">Run FCFS</button>
            </div>
        </div>
    </div>
    <br>
    <div class="block">
        <div id="ifManualOutput" style="display:block">
            <label>Total seek time is:&nbsp;</label>
            <span style="font-weight: bolder; color: #ffffff" id="fcfs_totalSeekCount"></span>
            <p></p>
            <label>Sequence of execution:&nbsp;</label>
            <span style="font-weight: bolder; color: #ffffff" id="fcfs_finalOrder"></span>
            <p></p>
            <label>Average seek time:&nbsp;</label>
            <span style="font-weight: bolder; color: #ffffff" id="fcfs_averageSeekCount"></span>
            <p></p>
            <p></p>

            </div>
        </div>
    </div>

    <div id="chartContainer" style="display: block"></div>
    <div id="betweenButton">

    <!-- Bootstrap core JavaScript -->
    <!-- jQuery.js -->
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js"
        integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo"
        crossorigin="anonymous"></script>

    <!-- Bootstrap.min.js -->
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js"
        integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k"
        crossorigin="anonymous"></script>
    <!-- Navbar -->

</body>

</html>